<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>编辑书籍</title>
  <link rel="stylesheet" href="../node_modules/swiper/dist/css/swiper.css">
  <link rel="stylesheet" href="./index.css">
  <script charset="utf-8" src="../node_modules/requirejs/require.js" data-main="init.js"></script>
</head>
<body>
  <div class="swiper-container swiper-container-h">
    <div class="swiper-wrapper">
      <!-- 第一页 loading -->
      <div class="swiper-slide loading">我在：<span id="processing">等待通信</span></div>
      <!-- 第二页 信息填写-->
      <div class="swiper-slide editor">
        <div class="left gallery">
          <div class="swiper-container gallery-top" id='gallery-top'>
            <div class="swiper-wrapper">
              <!-- <div class="swiper-slide" style="background-image:url('./index.jpg');"> </div> -->
            </div>
            <!-- Add Arrows -->
            <div class="swiper-button-next swiper-button-white"> </div>
            <div class="swiper-button-prev swiper-button-white"> </div>
          </div>
          <div class="swiper-container gallery-thumbs" id='gallery-thumbs'>
              <div class="swiper-wrapper">
                <!-- <div class="swiper-slide" style="background-image:url('./index.jpg');"></div> -->
              </div>
          </div>
        </div>
        <div class="right">
          <div class="form">
            <div class="swiper-container swiper-container-form">
              <div class="swiper-wrapper">
                <div class="swiper-slide">
                  <h1>封面</h1>
                  <div class="img" style="height:100%;"></div>
                  <div class="button" id = 'addCover'>next</div>
                </div>
                <div class="swiper-slide">
                  <h1>副·封面</h1>
                  <div class="img" style="height:100%;"></div>
                  <div class="button_noimg" id = 'addCoverAlt'>next</div>
                </div>
                <div class="swiper-slide">
                  <h1>元数据</h1>
                  <div class="MetaList">
                    <form>
                      <div class="MetaItemWrap">
                        <input type='text' alt='title' title="标题" placeholder="书籍标题"/>
                        <input type='text' alt='author' title="作者" placeholder="作者：英文逗号分隔"/>
                        <input type='text' alt='maker' title="制作者" placeholder="你的ID：英文逗号分隔"/>
                        <input type='text' alt='desc' title="说明" placeholder="简短的制（P）作（Y）声（JIAO）明（YI）"/>
                      </div>
                    </form>
                  </div>
                  <div class="dilan">
                    <div class="submit button_noimg" id = 'addMetadate'>下一页：授权信息</div>
                  </div>
                </div>
                <div class="swiper-slide">
                  <h1>授权</h1>
                  <div style="height:75%;">
                    <textarea name="inori_banquan" id="banquan" placeholder="填写作者等信息"></textarea>
                  </div>
                  <div class="button_noimg" id = 'addLicense'>next</div>
                </div>
                <div class="swiper-slide">
                  <h1>简介</h1>
                  <div style="height:75%;">
                      <textarea name="inori_jianjie" id="jianjie" placeholder="填写小说简介"></textarea>
                  </div>
                  <div class="button" id = 'addSummary'>next</div>
                </div>
                <div class="swiper-slide">
                  <h1>彩页</h1>
                  <div class="img" style="height:100%;"></div>
                  <div style="height:4em;">
                      <textarea name="inori_color" class="color" placeholder="填写彩页文字"></textarea>
                  </div>
                  <div class="colorDilan dilan">
                    <div class="addButton" id = 'addColor'>还有彩页！</div>
                    <div class="color_last_button" id = 'addColorLast' >next</div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <!-- 第三页 下载预定-->
      <div class="swiper-slide download">
        <!-- 制作完成后href会替换为objectURL,textcontent替换为'下载epub' -->
        <a href="#" target="_blank">正在制作</a>
      </div>
      <!-- end -->
    </div>
    <!-- Add Pagination -->
    <div class="swiper-pagination swiper-pagination-h"></div>
  </div>
</body>
</html>